<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script type="text/javascript" src="../js/global.js"></script>
	</head>
	<body>
		<fieldset class="layui-elem-field layui-field-title" style="margin-top: 10px;">
			<legend>题库</legend>
		</fieldset>
		
		<div id="searchePage" class="layui-form-item" style="margin-top: 10px;margin-left: 10px;">
			<form class="layui-form" method="post" onsubmit="return false;">
				<label class="layui-form-mid">题目:</label>
				<div class="layui-input-inline" style="width: 100px;">
					<input type="text" id="questionContent" name="questionContent" autocomplete="off"
						class="layui-input" />
				</div>
				<label class="layui-form-mid">出题起止时间:</label>
				<div class="layui-input-inline" style="width: 100px;">
					<input type="text" name="beginDate" id="beginDate" placeholder="yyyy-MM-dd"
						autocomplete="off" class="layui-input" />
				</div>
				<label class="layui-form-mid">--</label>
				<div class="layui-input-inline" style="width: 100px;">
					<input type="text" name="endDate" id="endDate" placeholder="yyyy-MM-dd"
						autocomplete="off" class="layui-input" />
				</div>
                <div class="layui-input-inline" style="width: 70px;">
					<button class="layui-btn" lay-submit lay-filter="search" id="search">
						<i class="layui-icon">&#xe615;</i>
					</button>
				</div>
				<div class="layui-input-inline">
					<button class="layui-btn" lay-event="createClass" id="addPage">添加</button>
				</div>
			</form>
		</div>
		<!--
			编辑弹层
		-->
		<div id="updatePage" style="display: none;">
			<form class="layui-form" action="" onsubmit="return false" lay-filter="updateForm">
		<div class="layui-col layui-col-space8">
				<div class="layui-col-md2" style="width: 550px;" >
						<label class="layui-form-mid"><span style="color: red;">*</span>类&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 型:  </label>
						<div class="layui-input-inline" style="width: 300px;">
							<select class="qu" id="update"  lay-filter="type" name="questionTypeId">
								<option></option>
							</select>
						</div>
				</div>
				<div class="layui-col-md2" style="width: 550px;" >
					<label class="layui-form-mid"><span style="color: red;">*</span>试&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 题:  </label>
					<div class="layui-input-inline" style="width: 300px;">
						
						<input type="text" name="questionContent"
							 class="layui-input" />
					</div>
				</div>
			</div>
			<br />
			<div class="layui-row layui-col-space8">
				<div class="layui-col-md2" style="width: 550px;">
					<label class="layui-form-mid"><span style="color: red;">*</span>分&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 值:  </label>
					<div class="layui-input-inline" style="width: 300px;">
						
						<input type="number" name="questionScore"
							 class="layui-input" />
					</div>
				</div>
				<div class="layui-col-md2" style="width: 550px;">
					<label class="layui-form-mid"><span style="color: red;">*</span>答&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 案:  </label>
					<div class="layui-input-inline" style="width: 300px;">
						<input type="text" name="questionAnswer"
							 class="layui-input" />
					</div>
				</div>
			</div>
			<br />
			<div class="layui-row layui-col-space8">
				<div class="layui-col-md2" style="width: 550px;">
					<label class="layui-form-mid"><span style="color: red;">*</span>答案解析:</label>
					<div class="layui-input-inline"  style="width: 300px;">
				 <textarea  name="questionAnalysis" type="text"  class="layui-textarea" ></textarea>
					</div>
				</div>
				<div class="layui-col-md2" style="width: 550px;">
					<label class="layui-form-mid"><span style="color: red;">*</span>难&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 度:  </label>
					<div class="layui-input-inline" style="width: 300px;">
						
						<input type="number" name="questionGrade"
							 class="layui-input" />
					</div>
				
				
			</div>
			<div class="layui-col-md2" style="width: 550px;" >
					<label class="layui-form-mid"><span style="color: red;">*</span>类&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 型:  </label>
					<div class="layui-input-inline" style="width: 300px;">
						<select class="su"   name="subjectId">
							<option></option>
						</select>
					</div>
			</div>
			<br />
			 <div class="choose"  style="display: none;">
			<!-- 选择题区域 -->
			<div class="layui-row layui-col-space8">
				<div class="layui-col-md2" style="width: 550px;">
					<label class="layui-form-mid" ><span style="color: red;">*</span>选项A:  </label>
					<div class="layui-input-inline" style="width: 300px;">
						<input type="text" name="itemA"
							 class="layui-input" />
					</div>
					
				</div>
				<div class="layui-col-md2" style="width: 550px;">
					<label class="layui-form-mid"><span style="color: red;">*</span>选项B:</label>
					<div class="layui-input-inline"  style="width: 300px;">
						<input type="text" name="itemB"
							 class="layui-input" />
					</div>
				</div>
				<div class="layui-col-md2" style="width: 550px;">
					<label class="layui-form-mid"><span style="color: red;">*</span>选项C:</label>
					<div class="layui-input-inline"  style="width: 300px;">
						<input type="text" name="itemC"
							 class="layui-input" />
					</div>
				</div>
				<div class="layui-col-md2" style="width: 550px;">
					<label class="layui-form-mid"><span style="color: red;">*</span>选项D:</label>
					<div class="layui-input-inline"  style="width: 300px;">
						<input type="text" name="itemD"
							 class="layui-input" />
					</div>
				</div>
				</div>
			</div>
			<br />
			
		</div>
			<div class="layui-btn-container" style="text-align: center;">
				<button class="layui-btn" lay-submit="" lay-filter="updateQuestion">保存</button>
			</div>
			</form>
		</div>
		<!-- 详情区-->
		<!-- <div id="detailPage" style="display: none;"> -->
			<div class="list" id="detailPage" style="display: none;">
				<form class="layui-form" action="" onsubmit="return false" lay-filter="detailForm">
					
				<div class="layui-col layui-col-space8">
						<div class="layui-col-md2" style="width: 550px;" >
								<label class="layui-form-mid"><span style="color: red;">*</span>类&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 型:  </label>
								<div class="layui-input-inline" style="width: 300px;">
									<select class="qu" id="detail" lay-filter="type" name="questionTypeId">
										<option></option>
									</select>
								</div>
						</div>
						<div class="layui-col-md2" style="width: 550px;" >
							<label class="layui-form-mid"><span style="color: red;">*</span>试&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 题:  </label>
							<div class="layui-input-inline" style="width: 300px;">
								
								<input type="text" name="questionContent"
									 class="layui-input" />
							</div>
						</div>
					</div>
					<br />
					<div class="layui-row layui-col-space8">
						<div class="layui-col-md2" style="width: 550px;">
							<label class="layui-form-mid"><span style="color: red;">*</span>分&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 值:  </label>
							<div class="layui-input-inline" style="width: 300px;">
								
								<input type="number" name="questionScore"
									 class="layui-input" />
							</div>
						</div>
						<div class="layui-col-md2" style="width: 550px;">
							<label class="layui-form-mid"><span style="color: red;">*</span>答&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 案:  </label>
							<div class="layui-input-inline" style="width: 300px;">
								<input type="text" name="questionAnswer"
									 class="layui-input" />
							</div>
						</div>
					</div>
					<br />
					<div class="layui-row layui-col-space8">
						<div class="layui-col-md2" style="width: 550px;">
							<label class="layui-form-mid"><span style="color: red;">*</span>答案解析:</label>
							<div class="layui-input-inline"  style="width: 300px;">
						 <textarea  name="questionAnalysis" type="text"  class="layui-textarea" ></textarea>
							</div>
						</div>
						<div class="layui-col-md2" style="width: 550px;">
							<label class="layui-form-mid"><span style="color: red;">*</span>难&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 度:  </label>
							<div class="layui-input-inline" style="width: 300px;">
								
								<input type="number" name="questionGrade"
									 class="layui-input" />
							</div>
						</div>
					    <div class="layui-col-md2" style="width: 550px;" >
					    		<label class="layui-form-mid"><span style="color: red;">*</span>类&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 型:  </label>
					    		<div class="layui-input-inline" style="width: 300px;">
					    			<select class="su"   name="subjectId">
					    				<option></option>
					    			</select>
					    		</div>
					    </div>
					<br />
					 <div class="choose"  style="display: none;">
					<!-- 选择题区域 -->
					<div class="layui-row layui-col-space8">
						<div class="layui-col-md2" style="width: 550px;">
							<label class="layui-form-mid" ><span style="color: red;">*</span>选项A:  </label>
							<div class="layui-input-inline" style="width: 300px;">
								<input type="text" name="itemA"
									 class="layui-input" />
							</div>
							
						</div>
						<div class="layui-col-md2" style="width: 550px;">
							<label class="layui-form-mid"><span style="color: red;">*</span>选项B:</label>
							<div class="layui-input-inline"  style="width: 300px;">
								<input type="text" name="itemB"
									 class="layui-input" />
							</div>
						</div>
						<div class="layui-col-md2" style="width: 550px;">
							<label class="layui-form-mid"><span style="color: red;">*</span>选项C:</label>
							<div class="layui-input-inline"  style="width: 300px;">
								<input type="text" name="itemC"
									 class="layui-input" />
							</div>
						</div>
						<div class="layui-col-md2" style="width: 550px;">
							<label class="layui-form-mid"><span style="color: red;">*</span>选项D:</label>
							<div class="layui-input-inline"  style="width: 300px;">
								<input type="text" name="itemD"
									 class="layui-input" />
							</div>
						</div>
						</div>
					</div>
					<br />
					
				</div>
				
				</form>
		 </div> 
		<!--
        	数据表格
        -->
	
    <table class="layui-hide" id="class_table" lay-filter="test">
		
	</table>
   <!--行内工具栏-->
   <script type="text/html" id="barDemo">
	<a class="layui-btn layui-btn-xs" lay-event="detail">详情</a>
   	<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
   	<a class="layui-btn layui-btn-xs" lay-event="update">编辑</a>
   </script>
  
  
		
        
</body>
	<script>
			layui.use(['table', 'form', 'layer', 'laydate', 'upload', 'element'],function(){
				var layer = layui.layer;
				var form = layui.form;
				var table = layui.table;
				var laydate = layui.laydate;
				var upload = layui.upload;
				var element = layui.element;
				var $ = layui.$;
				//渲染院系表
				$.get(globalData.examinationServer + '/questionType/listQuestionTypes', function(res) {
					var html = "";
					for (var i = 0; i < res.data.length; i++) {
						
						html += "<option  disabled value=" + res.data[i].questionTypeId + ">" + res.data[i].questionTypeName + "</option>"
				
					}
					
					$(".qu").append(html);
				
					form.render('select')
				}, "json")
				//渲染试题类型表
				$.get(globalData.examinationServer + '/subject/listSubjects', function(res) {
					var html = "";
					
					for (var i = 0; i < res.data.length; i++) {
						
						//html += "<input type="radio" name="${index}" value="res.data[i].questionTypeId+" title="${taoZimu}" $
						html += "<option  value=" + res.data[i].subjectId + ">" + res.data[i].subjectName + "</option>"
				
					}
					$(".su").append(html);
				
					form.render('select')
				}, "json")
				
				//渲染数据表格
				table.render({
					elem:'#class_table',
					height:400,
					url:globalData.examinationServer+'/question/listQuestions',
					method:"get",
					//headers: {token: globalData.getCurToken()},//设置请求头
					title:"用户表",
					page:true,
					cols:[
							[
							{
								field:'questionContent',
								title:'题目内容',
								sort:true,
								align:'center'
							},{
								field:'questionCreater',
								title:'出题者',
								sort:true,
								align:'center'
							},{
								field: 'questionScore',
								title: '题目分数',
								sort:true,
								align:'center'
							},{
								field: 'questionTypeId',
								title: '题目类型',
								templet:'<div>{{questionType(d.questionTypeId)}}</div>'
							},{
								field:'questionAnalysis',
								title:'题目解析'
								},{
								field:'questionAnswer',
								title:'正确答案'
								},{
								title:'操作',
								align:"center",
								toolbar:'#barDemo'
							}
							]
						],
						id:"testReload",
						done:function(res,curr,count){
						
						}
					});
						
						//添加班级弹出层
						$("#addPage").on('click',function(){
							layer.open({
								type:2,
								title:'添加试题',
								area: ['1100px', '600px'],
								content:'question_add.html',
								end:function(){
									//alert(1)
								}
							});
						});
				
				
				active={
					reload:function(){
						var questionContent=$("#questionContent");
						var beginDate=$("#beginDate");
						var endDate=$("#endDate");
						table.reload('testReload',{
							where:{
								'questionContent':questionContent.val(),
								'beginDate':beginDate.val(),
								'endDate':endDate.val()
								},
							curr:{
								page:1
							}
						});
					}
				};
				
				//查询操作
				$("#search").on('click',function(){
					var type=$(this).data('type');
					active[type]?active[type].call(this):'';
				})
				
				
				
//			
	          //行内工具栏监听
				table.on('tool(test)',function(obj){
					var data=obj.data;
					   
					switch(obj.event){
						case 'del':{
						layer.confirm('确认删除该试题的信息吗?',{icon:7},function(index){
							layer.close(index);
						   $.ajax({
								type : "delete",
								url : globalData.examinationServer+'/question/deleteQuestion',
								data:{
											questionId:data.questionId
										},//需要传递到服务端的数据
										dataType:'json',//服务端响应数据类型
										xhrFields: {
											withCredentials: true
										},
										// beforeSend: function(request) {
										// 	request.setRequestHeader("token", globalData.getCurToken());
										// },
										success : function(res) {
											if(res.code == 0){
												layer.msg(res.msg,{icon:1,time:2000},function(index){
													table.reload('testReload');
												});
												
											}else{
												layer.msg(res.msg,{icon:2,time:2000});
											}
									}
									});
									
								});
								}
						break;
						case 'update':
						//表单赋值
						form.val('updateForm',data);
					   var value=$("#update option:selected").text();
					   alert(value);
					   if(value=='单选'||value=='多选'){
					   	$(".choose").css("display","");
					   }else{
					   	$(".choose").css("display","none");
					   }
						var update_index=layer.open({
							type:1,
							title:'您正在修改试题的信息',
							area: ['1100px', '600px'],
							content: $('#updatePage'),
							success:function(layero,index){
								//修改提交
								form.on('submit(updateQuestion)',function(obj){
									//console.log(obj.field);
									$.ajax({
										type : "put",
										url : globalData.examinationServer+'/question/updateQuestion',
										data:obj.field,//需要传递到服务端的数据
										dataType:'json',//服务端响应数据类型
										xhrFields: {
											withCredentials: true
										},
										// beforeSend: function(request) {
										// 	request.setRequestHeader("token", globalData.getCurToken());
										// },
										success : function(res) {
											if(res.code == 0){
												layer.msg(res.msg,{icon:1,time:2000},function(index){
													layer.close(update_index);
													table.reload('testReload');
												});
												
											}else{
												layer.msg(res.msg,{icon:2,time:2000});
											}
									}
									});
								});
							}
						});
						
							break;
							//详情
							case 'detail':
							//表单赋值
							form.val('detailForm',data);
							console.log(data);
							var value=$("#detail option:selected").text();
							alert(value);
							if(value=='单选'||value=='多选'){
								$(".choose").css("display","");
							}else{
								$(".choose").css("display","none");
							}
							 form.render('select')
								var detaile_index=layer.open({
								type:1,
								//title:'您正在修改本题的信息',
								area: ['1100px', '600px'],
								content: $('#detailPage'),
								success:function(layero,index){
								//修改提交
	
								}
							});
						
							break;
						
					}
				});
	
			});
			
			//应用template模板，渲染专业
			    function questionType(questionTypeId){
					var qId = questionTypeId;
			        var title;
			        $.ajax({
			            url:globalData.examinationServer+ '/questionType/listQuestionTypes',//你的后台请求路径
			            dataType:'json',
			            async: false,//同步
			            success:function(data){
							$.each(data.data,function (index,obj) {
								//console.log("q"+qId);
								console.log(data.data);
								//console.log(obj.questionTypeId==qId);
									 if(obj.questionTypeId==qId){
										title=obj.questionTypeName;
			                             
			                        }
			                    });
			            }
			        });
			        return title;
			    };
			

			
		</script>
</html>
<!-- <script type="text/html" id="demo">
   	{{# if(d.questionTypeId == 0){ }}
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="单选" checked="">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="多选">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="填空">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="判断">
     <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="问答">
	 {{# if(d.questionTypeId == 1){ }}
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="单选" >
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="多选" checked="">
      <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="填空">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="判断">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="问答">
	 {{# if(d.questionTypeId == 2){ }}
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="单选" >
	
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="多选">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="填空" checked="">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="判断">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="问答">
	 {{# if(d.questionTypeId == 3){ }}
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="单选" >

	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="多选">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="填空" >
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="判断" checked="">
	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="问答">
   {{# }else{ }}
   	 <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="单选" >
     <input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="多选">
   		<input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="填空" >
   		<input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="判断" >
   		<input name="questionTypeId" value="{{d.questionTypeId}}" type="radio" title="问答" checked="">
   	{{# } }}
   </script> -->